<div>
  <h1>投资计划列表</h1>
  <el-row style="text-align: right" >
    <el-button size="medium" type="primary" @click="dialogFormVisible = true" >添加计划</el-button>
    <el-button size="medium" type="danger" @click="onDeleteTrade()" >删除</el-button>
  </el-row>

  <el-row :gutter="20">
    <el-col :span="8">
      <el-card class="box-card" style="height: 240px" >
        <div class="text item" >
          投资计划1
        </div>
      </el-card>
    </el-col>

    <el-col :span="8">
      <el-card class="box-card" style="height: 240px" >
        <div class="text item" >
          投资计划1
        </div>
      </el-card>
    </el-col>

    <el-col :span="8">
      <el-card class="box-card" style="height: 240px" >
        <div class="text item" >
          投资计划1
        </div>
      </el-card>
    </el-col>
  </el-row>

  <el-dialog title="添加计划" :visible.sync="dialogFormVisible">
    <el-form :model="form">
      <el-form-item label="计划名称" :label-width="formLabelWidth">
        <el-input v-model="form.name" autocomplete="off"></el-input>
      </el-form-item>
      <el-form-item label="资产类型" :label-width="formLabelWidth">
        <el-select v-model="form.region" placeholder="请选择资产类型">
          <el-option label="A股股票" value="stock-chinese"></el-option>
          <el-option label="美股股票" value="stock-usa"></el-option>
          <el-option label="美股期权" value="stock-option"></el-option>
          <el-option label="股票基金" value="stock-fund"></el-option>
          <el-option label="货币基金" value="fund"></el-option>
        </el-select>
      </el-form-item>

      <el-form-item label="初始资产" :label-width="formLabelWidth">
        <el-input v-model="form.baseMoney" autocomplete="off"></el-input>
      </el-form-item>
    </el-form>
    <div slot="footer" class="dialog-footer">
      <el-button @click="dialogFormVisible = false">取 消</el-button>
      <el-button type="primary" @click="onPushTrade()">确 定</el-button>
    </div>
  </el-dialog>
</div>
